<template>
	<view>
		<view class="lh2 pad2">
			<view class="list-style-2 flrc ">
				<view class="flex1">选择设备</view>
				<view class="cu-btn line-green sm round" @click="showSelected = !showSelected">{{showSelected?'隐藏':'选择'}}</view>
			</view>
			<view class="martb2 flrc lh2 padt5" v-show="showSelected">
				<view class="wh30-30 flcc bdso round3 marr10 pos-r" @tap="scanMachine">
					<view class="cuIcon cuIcon-scan fs24 mart5"></view>
					<view class="mart2">扫码选择</view>
					<ripple></ripple>
				</view>
				<view class="wh30-30 flcc bdso round3 pos-r" @tap="showSelect">
					<view class="cuIcon cuIcon-list fs24 mart5"></view>
					<view class="mart2">列表选择</view>
					<ripple></ripple>
				</view>
			</view>
			<!-- 显示选择的设备 -->
			<view class="flrc pad3 bdso bc13 mart3" @tap="showSelect" 
			v-if="isbool(selectedMachine.iri) || isbool(selectedMachine.code)">
				<machine-item class="w100" 
				:iri.sync="selectedMachine.iri" 
				:code.sync="selectedMachine.code"
				@input="gotMachine"
				></machine-item>
			</view>
		</view>
		<view v-show="isbool(showSelectList)">
			<machine-selector :show="showSelectList" @onSelect="selectMachine"></machine-selector>
		</view>
	</view>
</template>

<script>
	import machineItem from './machine_item.vue'
	import machineSelector from './machine_selector.vue'
	export default {
		components:{machineSelector,machineItem},
		props:{
			value:''
		},
		data() {
			return {
				showSelectList: false,
				showSelected: true,
				selectedMachine: {
					id: '',
					code: '',
					iri: ''
				},
				en: {
					machine: '',
					category: '',
					level: '',
					emergency: '',
					needStop: false,
					info: '',
					contactName: '',
					contactPhone: '',
					pic: [],
				}
			}
		},
		methods: {
			showSelect() {
				this.log('showSelect')
				this.showSelectList = Math.random()
			},
			selectMachine(val) {
				this.log(val)
				// this.en.machine = val
				this.selectedMachine.iri=val
				this.showSelected=false
				this.$emit('input',val)
			},
			scanMachine() {
				this.$dev.scan(info => {
					this.log(info)
					this.selectedMachine.code = info
				}, (err) => {
					this.log(err)
				})
			},
			gotMachine(val){
				this.$emit('input',val)
				this.$emit('change',val)
			}
		},
		watch:{
			value(cur,old){
				if(!this.isbool(cur)) return
				this.selectMachine(cur)
			}
		}
	}
</script>

<style>
</style>
